import React, {Component} from 'react'
import { routerShape } from 'react-router';
import {inject, observer} from 'mobx-react';
import { toJS } from 'mobx';
import {Pagination } from 'antd'
import ComVar from '../ComVar'
const {WeiboType} = ComVar
import '../../../../style/myComment/rightContainer/weibo.less'
import WeaWhitePage from "../wea-white-page"
import CommentContainer from './CommentContainer'
import CommentEdit from './CommentEdit'
import CommentNormal from './CommentNormal'

import { WeaLocaleProvider, WeaNewScrollPagination,WeaNewScroll} from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;

@inject('checkMatterStore')
@observer

class Comment extends Component {
    static contextTypes = {
        router: routerShape
    }

    constructor(props) {
        super(props)
    }
    render() {
        const {records, checkMatterStore,userInfo,  weiboCKEditorConfig,hasScroll, hasEditor, hasImage, defaultTemplate, height, keyWords,topHeight,loading,comment,showSlideEdit,defaultHeight} = this.props,
            {currentUser = {}} = userInfo,
            {
                discussList = [],
                isManagerScore = 0,
                isMood = 0
            } = records

        let hasSubmited = true;
        let weibos = []
        if (hasEditor) weibos.push({type: WeiboType.current})
        if (discussList[0]) {
            const {type} = discussList[0]
            if ( (type != WeiboType.normal) && hasEditor) {
                weibos = weibos.concat(discussList.slice(1))
            } else {
                weibos = weibos.concat(discussList)
            }
        }
        const content = this.renderWeiboDom(checkMatterStore,weibos, currentUser, isManagerScore, isMood, hasScroll, hasEditor, hasImage, defaultTemplate, weiboCKEditorConfig, keyWords,comment,showSlideEdit)
            return (
                hasEditor ? (
                    <div className="g-comment-content" style={{backgroundColor: "#fff"}}>
                        {
                            hasScroll ? (
                                <div>
                                    <CommentEdit ecId={`${this && this.props && this.props.ecId || ''}_CommentEdit@oz08br`}
                                        checkMatterStore={this.props.checkMatterStore}
                                        hasSubmited={hasSubmited}
                                        defaultTemplate={defaultTemplate}
                                        weiboCKEditorConfig={weiboCKEditorConfig}
                                    />
                                    <div className='g-comment-container'>
                                        <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@ut3se1`} toTop = {true} height={defaultHeight?defaultHeight:500} loading={loading}>
                                            {content}
                                            <Pagination ecId={`${this && this.props && this.props.ecId || ''}_Pagination@zo7czm`} defaultCurrent={1} defaultPageSize={10}  total={toJS(this.props.checkMatterStore.status.weiboList.total)} showTotal={total => `共 ${total} 条`}
                                                onChange={(page,pageSize)=>{this.paginationChange(page,pageSize)}}
                                                onShowSizeChange={(page,pageSize)=>{this.pageSizeChange(page,pageSize)}}
                                                showQuickJumper={true}
                                                showSizeChanger={true}
                                                />
                                        </WeaNewScroll>
                                    </div>
                                </div>
                            ) : (
                                <div className="g-NoTime">
                                    {
                                        (weibos.length > 1) ? {content} : <WeaWhitePage ecId={`${this && this.props && this.props.ecId || ''}_WeaWhitePage@ruqczt`} height={height}/>
                                    }
                                </div>
                            )
                        }
                    </div>
                ) : (
                    weibos.length > 0 ? (
                        <div className="g-comment-content" style={{backgroundColor: "#fff"}}>
                            {
                                hasScroll ? (
                                      {content}
                                ) : (
                                    <div className="g-NoTime">{content}</div>
                                )
                            }
                        </div>
                    ) : <WeaWhitePage ecId={`${this && this.props && this.props.ecId || ''}_WeaWhitePage@58i49p`} height={height}/>
                )
            )
    }
    //改变页面
    paginationChange(page,pageSize){
        const {getPageInfo,taskId} = this.props.checkMatterStore;
        getPageInfo({"taskId":taskId,"pageindex":page,"pagesize":this.props.checkMatterStore.pagesize},);
    }
    //改变条数
    pageSizeChange(page,pageSize){
        const {getPageInfo,taskId} = this.props.checkMatterStore;
        getPageInfo({"taskId":taskId,"pageindex":page,"pagesize":pageSize},);
    }

    renderWeiboDom = (checkMatterStore, weibos, currentUser, isManagerScore, isMood, hasScroll, hasEditor, hasImage, defaultTemplate, weiboCKEditorConfig, keyWords,comment,showSlideEdit) => {
        let preWorkData = "";
        return weibos.map(
            (item, key) => {
                let {
                        type, createdate = "", createtime = "", content, userName, userid, imageurl,essayUnit,instructType,taskname,
                        isCanEdit,isHasLocation,instructReplyList = []
                    } = item,
                    user = {name: userName, id: userid, src: imageurl,source:essayUnit,instructType:instructType},
                    blogId = item.id,
                    date = createdate && createtime ? (createdate + " " + createtime) : "",
                    isLast = key == weibos.length - 1 ? true : false,
                    isAgree = false;

                const renderContent = COM => {
                    console.log("key",blogId);
                    return (
                        <div className = 'g-comment-container-item'>
                                {/* 评论列表 */}
                                <CommentContainer ecId={`${this && this.props && this.props.ecId || ''}_CommentContainer@tewvi2@${blogId}`}
                                _key={key}
                                checkMatterStore={checkMatterStore}
                                blogId={blogId}
                                isAgree={isAgree}
                                content={content}
                                currentUser={currentUser}
                                user={user}
                                date={date}
                                type={type}
                                createdate={createdate}
                                defaultTemplate={defaultTemplate}
                                isManagerScore={isManagerScore * 1}
                                isLast={isLast * 1}
                                isCanEdit={isCanEdit * 1}
                                comments={instructReplyList || []}
                                hasEditor={hasEditor}
                                hasImage={hasImage}
                                hasScroll={hasScroll}
                                weiboCKEditorConfig={weiboCKEditorConfig}
                                isHasLocation={isHasLocation}
                                comment={comment}
                                showSlideEdit={showSlideEdit}
                                taskname = {taskname}
                            >
                                <COM ecId={`${this && this.props && this.props.ecId || ''}_COM@81p65j@${blogId}`} data={content} id={blogId} keyWords={keyWords}/>
                            </CommentContainer>
                        </div>
                    )
                }
                if (hasScroll) {
                    return (
                        <div
                            type={type}
                            tipDate={createdate + " " + createtime}
                        >
                            {type == WeiboType.normal ? renderContent(CommentNormal) : null}
                        </div>
                    )
                } else {//删除
                    <WeaWhitePage ecId={`${this && this.props && this.props.ecId || ''}_WeaWhitePage@1jjft5@${blogId}`} height={height}/>
                }
            }
        )
    }
}

Comment.propTypes = {
    userInfo: React.PropTypes.object,//使用currentUser.id属性
    height: React.PropTypes.number,//声明定高
    //isReset: React.PropTypes.bool,//将其置为true，滚动条会置顶，用于切换card时。
    defaultTemplate: React.PropTypes.object,//使用tempContent属性，用于保存之前的编辑内容
    records: React.PropTypes.object,//显示的数据，其中的discussList会和之前的数据拼起来,isManagerScore为是否有打分权限，isMood与__hasData现在无用
    //blogType: React.PropTypes.any,//用于生成CKEditor的唯一标识
    hasScroll: React.PropTypes.bool,//是否显示时间轴
    hasEditor: React.PropTypes.bool,//审批意见是否可编辑？
    hasImage: React.PropTypes.bool//是否显示头像
};
export default Comment
